<template>
  <div class="newinfo">
    <h2>{{xqlist.title}}</h2>
    <p class="p1">
      <span class="name">{{xqlist.author}}</span>
      <span class="time">{{xqlist.createTime}}</span> 
      <span class="num">{{xqlist.visit}}</span>
    </p>

    <!-- <p class="p2">{{xqlist.synopsis}}</p> -->
    <p
      v-html="xqhtml"
      class="p3"
    >
      {{xqhtml}}
    </p>
  </div>
</template>
<script>
export default {
  props: ["id"],
  data() {
    return {
      // 单条资讯详情内容
      xqlist: [],
      xqhtml: "",
    };
  },
  methods: {
    async getxqdata() {
      const res = await this.$http.zixunxq( this.id );
      console.log(res);
      this.xqlist = res.data.data;
      this.xqhtml = this.xqlist.content;
      console.log(this.xqhtml);
    },
  },
  created() {
    this.getxqdata();
  },
};
</script>
<style lang="scss">
.newinfo {
  .p1 {
    .name {
      font-size: 15px;
      color: #b1b2b3;
      margin: 0px 5px;
    }
    .time {
      font-size: 15px;
      color: #b1b2b3;
      margin: 0px 5px;
    }
    .num {
      font-size: 15px;
      color: #b1b2b3;
      margin: 0px 5px;
    }
  }
  .p3 {
    .one-p {
      span {
        display: inline-block;
        .content-picture {
          width: 100%;
          height: 100%;
        }
      }
    }
  }
}
</style>